body,html
  line-height: 1
  font-weight: 200


border-1px($color)
  position: relative
  &:before
    display: block
    position: absolute
    left: 0
    bottom:0
    width: 100%
    border-top:1px solid $color
    content:' '

border-none()
  &:before
    display: none

border-1px-top($color)
  &:before
    display: block
    position: absolute
    left: 0
    top:0
    width: 100%
    border-top:1px solid $color
    content:' '  

button-1px($color,$radius)
  position: relative
  &:before
    display: block
    position: absolute
    top: 0
    left:0
    width: 100%
    height 100%
    border:1px solid $color
    border-radius $radius
    content:' '
  

@media (-webkit-min-device-pixel-ratio:1.5),(min-device-pixel-ratio:1.5)
  .border-1px
    &:before
      -webkit-transform: scaleY(0.7)
      transform: scaleY(0.7)

@media (-webkit-min-device-pixel-ratio:2),(min-device-pixel-ratio:2)
  .border-1px
    &:before
      -webkit-transform: scaleY(0.5)
      transform: scaleY(0.5)

@media (-webkit-min-device-pixel-ratio:3),(min-device-pixel-ratio:3)
  .border-1px
    &:before
      -webkit-transform: scaleY(0.3)
      transform: scaleY(0.3)


bg-image($url)
  background-image: url($url+'@2x.png')
  @media (-webkit-min-device-pixel-ratio:3),(min-device-pixel-ratio:3)
    background-image: url($url+'@3x.png')